<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>

        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <title>抽题</title>
        <link rel="stylesheet" type="text/css" href="css/base.css">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <style type="text/css">
            .subject-msg{
                background-color: #FFFAE3 ;
                width: 416px;
                height: 67px;
                position: absolute;
                top: 300px;
                left: 50px;
                display:none;
                text-indent: 2em;
                padding: 4px;
                color: red;
                font-size: 14px;
            }

        </style>

    </head>
    <body>
    <div class="containner">
        <div class="regist-title">
            温馨提示：每人仅有一次抽题机会
        </div>
        <div class="regist-form" style="position: relative">
            <form action="http://127.0.0.1:8081/extract" method="post" id = "extractForm">
                <div class="error-msg" id = "errorMsg">

                </div>
                <div class="clearfix">
                    <div class="lf input-lable">
                        学号:
                    </div>
                    <div class="lf input-containner">
                        <input type="text" name="stuNo" id = "stuNo" size="12" maxlength="12" autocomplete="off"/>
                    </div>
                    <div class="lf phone-ok" id = "phoneOk">
                    </div>
                </div>
                <div class="clearfix">
                    <div class="lf input-lable">
                        手机号码:
                    </div>
                    <div class="lf input-containner">
                        <input type="text" name="stuPhone" id = "stuPhone" size="12" maxlength="12" autocomplete="off"/>
                    </div>
                </div>
                <div class="clearfix">
                    <div class="lf input-lable">
                        姓名:
                    </div>
                    <div class="lf input-containner">
                        <input type="text" name="stuName" id = "stuName" size="12" maxlength="12" autocomplete="off"/>
                    </div>
                </div>
                <div class="submit" id = "extract">
                    抽题
                </div>

            </form>
            <div class="subject-msg" id = "subject-msg">

            </div>
        </div>
    </div>
    <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="js/jquery-form.js"></script>
    <script type="text/javascript" >
        $("#extract").click(function () {
            $("#subject-msg").slideDown(1000);

            // var html = "恭喜，您抽中的课题为:xxx；指导老师是xxx；联系电话:xxx；邮箱:xxx；";
            // var html = "您已经抽过课题了，您抽中的课题为:xxx；指导老师是xxx；联系电话:xxx；邮箱:xxx；";
            // var html = "抱歉，题库用完了哦，请联系管理员:95530!";
            // $("#subject-msg").text(html);


            $("#extractForm").ajaxSubmit({
                dataType : "json",
                success :function (subjectJson) {
                   var flag = subjectJson.flag;
                   var html = "";
                   if(flag == "0"){
                       html = "抱歉，题库用完了哦，请联系管理员:95530!";
                   }else if(flag == "1"){
                       html = "您已经抽过课题了，您抽中的课题为:" + subjectJson.subject.subjectName + "；指导老师是" + subjectJson.subject.teacherName
                                 + "；联系电话:" +subjectJson.subject.teacherPhone + "；邮箱:" + subjectJson.subject.teacherEmail + "；";
                   }else{
                       html = "恭喜，您抽中的课题为:" + subjectJson.subject.subjectName + "；指导老师是" + subjectJson.subject.teacherName
                           + "；联系电话:" +subjectJson.subject.teacherPhone + "；邮箱:" + subjectJson.subject.teacherEmail + "；";

                   }

                    $("#subject-msg").text(html);

                }
            });
        });
    </script>


    </body>

</html>